<template>
<div>
    <div v-if="selFoot==1">
        <ul class="bg-fff">
            <li :key="key"  v-for="(val,key) in this.$store.state.cccardList">
                <DZX :cccard='val'></DZX>
            </li>
        </ul>
    </div>
     <div v-if="selFoot==1">
        <ul class="bg-fff">
            <li :key="key"  v-for="(val,key) in this.$store.state.cccardList">
                <PLAN :cccard='val'></PLAN>
            </li>
        </ul>
    </div>
    
    <div class="foot-box fiex center">
        <div @click="selFootFun(1)" :class="{'sel':selFoot==1}" class="fiex1">
            制定计划
        </div>
        <div class="foot-l"></div>
        <div @click="selFootFun(2)" :class="{'sel':selFoot==2}" class="fiex1">
            计划查询
        </div>
    </div>
    </div>
</template>
<style lang="scss" scoped>
    .foot-box .sel{color:#4F8BF4; }
    .foot-box{position: fixed; bottom:0; width: 100%; border: 1px solid #cccc; padding: 15px 0; box-shadow: 0px -2px 3px 3px rgba(245, 241, 241, 0.8)  }
    .foot-l{height: 20px; border-right: 1px solid #cccc;}
</style>
<script>
    import DZX from '@/components/dzx.vue'
    import PLAN from '@/components/views/playList.vue'
    // import wancheng from '@/components/wancheng.vue'
    // import zhongduan from '@/components/zhongduan.vue'
    // import zxz from '@/components/zxz.vue'
var $th ="";
    export default {
        components:{
            DZX,
            PLAN
        },
        data() {
            return {
                selFoot:1,
                cardId: "",
                wtaccid: "",
                pId: "",
                aisleMerId: this.$store.state.aisleMerId,
            };
        },
        created: function () {
            this.issh = true;
            console.log("this.$store.state.cccardList",this.$store.state.cccardList)
            this.$Spin.show();
            this.getcardlist();
            this.$Spin.hide();
            this.$store.state.sentlist = '';
            this.$store.state.feamout = 0;
            console.log(this.$store.state);
        },
        filters: {
            fmttype: function (card) {
                // console.log("card",card)
                //  return dzx
                // if (card.plan == null) {
                //     return dzx
                // } else if (card.plan != null && card.plan.state == 2) {
                //     return zxz
                // } else if (card.plan != null && card.plan.state == 6) {
                //     return wancheng
                // } else if (card.plan != null && card.plan.state == 4) {
                //     return zhongduan
                // }
            },
        },
        mounted(){
            $th =this;
        },
        methods: {
            selFootFun(req){ //选择底部
                this.selFoot = req;
            },
            onRefresh() {
                this.getcardlist();
                this.$Spin.hide();

            },
        }
    }
</script>